<%@ include file="/WEB-INF/jspf/tag-libraries.jspf"%>
<%@ taglib uri="http://displaytag.sf.net" prefix="display"%>

<ttjhome:bundle basename="companies/companies" />
<ttjhome:resource basename="companies/companies" bundle="errorBundle" scope="request" />
<ttjhome:rewrite var="editURL" action="/jobs/edit.do?action=edit" form="true"/>
<ttjhome:rewrite var="tagsURL" action="/tags.do?action=getAllTags" form="false"/>
<ttjhome:rewrite var="viewActivitiesURL" action="/jobs/activity.do?action=listActivities" form="false"/>
<ttjhome:rewrite var="listCandidatesURL" action="/candidates/list.do?action=match" form="false"/>
<ttjhome:rewrite var="closeActivityURL" action="/candidates/activity.do?action=closeActivity" form="false"/>
<ttjhome:rewrite var="newProgressURL" action="/candidates/activity.do?action=newProgress" form="false"/>
<script type="text/javascript">

function saveJob(){
	drawLoading();

	$("#jobSaveForm").submit();

}


function drawLoading() {
	$("#loadingBox").css({
		"height": $(window).height()+ 'px',
		"display": "inline"
	});
	

	$("#loadingDialog").css({
		"top": ($(window).scrollTop() + ($(window).height() / 2)) + 'px'
	});
}
function reopenJob(){
	drawLoading();
	

}

function closeJob(){
	drawLoading();
	

}


	$(function() {
		$("#view-activities" )
			.button()
			.click(function() {
				//get activities
				 var url = "${viewActivitiesURL}"; 
				 url+="&jobId="+${jobForm.map.jobID};
				  $.getJSON(url, function(json){
				        if (json.result == 0) {
								$.each(json.data, function(id, job){
									$.generateActivityContainer(json);
							});
						}
						 else {
				            alert("error when getting jobs");
				        }
				});
				
			});
	
		
		$("#match-candidates" )
		.button()
		.click(function() {
			//redirect to candidate list page
			 var url = "${listCandidatesURL}"; 
			 url+="&jobId="+${jobForm.map.jobID};
			 window.location.href = url;
		});
		$("#dialog-newprogress" ).dialog({
			autoOpen: false,
			height: 200,
			width: 550,
			modal: true,
			
			buttons: {
				"Add": function() {
					var activityId = $("#inputActivityId").val();
					var description =$("#newProgress").val();
					
					var url = "${newProgressURL}";
					url=url+"&activityId="+activityId+"&newProgress="+description;
					  $.getJSON(url, function(json){
					        if (json.result == 0) {
					        	$.generateActivityContainer(json);
					        		
							}
							 else {
					            alert("error when adding new progress jobs");
					           
							 }
						});
					  $( this ).dialog( "close" );
					
				},
				Cancel: function() {
					$("#inputActivityId").val("");
					
					$( this ).dialog( "close" );
				}
			}
		});
		function IgnoreSpaces(Str){
		    var ResultStr = "";
		    Temp=Str.split(" ");
		    for(i = 0; i < Temp.length; i++){
		    ResultStr +=Temp[i];
		    }
		    	return ResultStr;
			} 
		$.generateActivityContainer=function(json){
			var content = '';
			var menuIds=new Array();
			var activityIds = new Array();
			var activityStatuses = new Array();
			content +='<div>';
			$.each(json.data, function(id, activity){
			content +='<div class="activity">';
			var menuId=IgnoreSpaces(activity.candidateName+activity.jobName+id);
			content +='<div class="leftCol">'+'<h4>Candidate Name:'+activity.candidateName+'</h4></div>';
			content +='<div class="rightCol"><span id="'+menuId+'">'+activity.status+'</span></div>';
			content += '<div class="clear5"></div>';
			content += '<div ><ul class="ui-widget" >';
			$.each(activity.records,function(id,record){
				content += '<li>'+record.record+'<span> On '+record.recordTime+'</span>'+'</li>';
			});
			content += '</ul></div>';
			content +='</div>';
			menuIds.push(menuId);
			activityIds.push(activity.id);
			activityStatuses.push(activity.status);
			});
			content +='</div>';
			$('#activities-contain').html(content);
			for (var i=0; i<menuIds.length; i++) {
				var options = {minWidth: 120, arrowSrc: 'arrow_right.gif', copyClassAttr: true, onClick: function(e, menuItem){
				if($(this).text()=='Close'){
					var closeUrl = "${closeActivityURL}"+"&activityId="+menuItem.data; 
					$.getJSON(closeUrl, function(json1){
						if (json1.result == 0) {
							$.generateActivityContainer(json1);
						}
						else {
							alert("error when closing activity");
						}
					});
				}
				if($(this).text()=='New Progress'){
					$("#inputActivityId").val(menuItem.data);
					
					$("#dialog-newprogress" ).dialog( "open","option" , "activityId", menuItem.data);
				}
				}};
							
				//creating a menu without items
				var menu = new $.JianghMenu('#'+menuIds[i], null, options);
				//adding items to the menu
				if(activityStatuses[i]=='InProgress'){
					menu.addItems([
						new $.MenuItem({src: 'Close', data:activityIds[i]}, options),
						new $.MenuItem({src: 'New Progress',data:activityIds[i]},options)
						]); 
				}
			}		
		
		}

	});
	
	
	$(document).ready(function() {
	   <c:set var="status" value="${jobForm.map.status}"/>
		<c:if test="${Constants.JOB_CLOSED_STATUS==status}">
				$("#savebutton").hidden();
				$("#closeJobButton").hidden();
				$("#reopenbutton").show();
		</c:if> 
	   var url = "${tagsURL}";
		$.getJSON(url, function(json){
	        if (json.result == 0) {
				   if (json.data != null) {
				   var arr = new Array();
					   	  <c:if test="${not empty tags}">
					   	  	
		 							<c:forEach var="ff" items="${tags}" >
										arr.push("${ff.tag}");
									</c:forEach>
	 							 </c:if>
	 							
		            		$("#jobtags").tagit({
		            			availableTags: json.data,
		            			candidatesTags:arr
		            		});
	            }
	        }
	        else {
	            alert("error when getting tags");
	        }
	    });
})
</script>
<div class="toolBody">
		<div class="candidatesH2">
			<div class="leftCol">
				<h2>
					<fmt:message key="edit.job.title"/> (${companyForm.map.companyName})
				</h2>
			</div>
			<div class="rightCol">
			    <c:choose>
					<c:when test="${Constants.JOB_CLOSED_STATUS!=status}">
						<fmt:message key="job.active" var="jobactive"/>
						<h2><label for="jobDescription" >${jobactive}</label> </h2>
					</c:when>
					<c:otherwise>
					<div id="reopenbutton"  >
						<fmt:message key="reopen.job.button" var="reopenJobButton"/>
						<input name="reopen" type="button" value="${reopenJobButton}" onclick="reopenJob();" />
					</div>
					</c:otherwise>
				</c:choose>	
			</div>
			<div class="clear"></div>
		</div>	
		<div id="error" class="couponErrMsg">
			<tiles:insert definition="errors-page-header">
				<tiles:put name="errorStyle" value="err-msg" />
				<tiles:put name="errorIcon" value="/include/img/error-sign-sm.gif" />
			</tiles:insert>
		</div>
		<html:form method="post" action="${editURL}" styleClass="candidateEditForm"  styleId="jobSaveForm">
				<html:hidden property="jobID" styleId="jobID"/>
		<div class="clear5"></div>
			<div class="leftCol">
			<fmt:message key="job.name" var="jobName"/>
			<tf:input errorClass="err" name="jobName"/>
			<h3><label for="jobName" class="${err}">${jobName}</label> </h3>
			<div class="candidateEditLable">
				<html:text property="jobName"   maxlength="60"/>
			</div>
		</div>
		

		
		<div class="clear5"></div>
		<div class="leftCol">
			<fmt:message key="job.description" var="jobDescription"/>
			<tf:input errorClass="err" name="jobDescription"/>
			<h3><label for="jobDescription" class="${err}">${jobDescription}</label> </h3>
			<div class="candidateEditLable">
				<html:textarea property="description"   />
			</div>
		</div>
		
		<div class="clear5"></div>
		<div class="line">
			<label for="tags">Tags</label>
			<ul id="jobtags"></ul>
		</div>
		
		<div class="clear5"></div>
	
		<div class="candidateEditSave">
			<html:hidden property="filter"/>
		</div>
		<div id="savebutton" class="leftCol">
			<fmt:message key="save.company.button" var="saveJobButton"/>
			<input name="Save" type="button" value="${saveJobButton}" onclick="saveJob();" />
		</div>
		<div id="closebutton" class="rightCol">
			<fmt:message key="close.job.button" var="closeJobButton"/>
			<input name="Close" type="button" style ="float:right" value="${closeJobButton}" onclick="closeJob();" />
		</div>

		<div class="clear5"></div>
		<div id="loadingBox" class="pageMaskBox">
			<div class="pageMask">
				<!--[if lt IE 7]>
				<iframe class="maskIframe"></iframe>
				<![endif]-->
			</div>
			<div id="loadingDialog" class="loadingDialog">
				<p><img src="../include/img/loading.gif"/></p>
				<p><fmt:message key="loading.text"/></p>
			</div>
		</div>
		</html:form>
		
		<div id="viewActivities" >
			<button id="view-activities" >View Activities</button>
		</div>
		
		<div id="matchCandidates" >
			<button id="match-candidates" >Match Candidates</button>
		</div>
		
		<div id="activities-contain" class="ui-widget" >
		</div>

		<div id="dialog-newprogress" title="Add new progress">
		<form>
		<fieldset>
			<label for="progress">New Progress</label>
			<input type="text" name="newProgress" id="newProgress" class="text ui-widget-content ui-corner-all" />
		</fieldset>
		</form>
		</div>
		
		<input type="hidden" id="inputActivityId" value=""/>
	
</div>